<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:a4j="http://richfaces.org/a4j"
      xmlns:rich="http://richfaces.org/rich"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="/templateDefault.xhtml">
        <ui:define name="content">
            <rich:panel title="#{msg.adm_tbl_categoria_produto_lbl}" style="width: 99.5%">
                <h:outputLabel value="#{msg.adm_tbl_categoria_produto_lbl}" style="font-weight: bold"/>
                <hr align="left" width="500" style="margin-top: 1px"/>
                <h:form prependId="false">
                    <h:panelGrid columns="3">
                        <h:outputLabel for="nome" value="#{msg.campo_categoria_produto}"/>
                        <h:inputText id="nome" value="#{categoriaProdutoMB.modelo.nome}" size="66">
                            <a4j:ajax event="focus" render="res"/>
                        </h:inputText>
                        <a4j:commandButton execute="@form" render="nome itensRegistoTable res" title="#{msg.botao_gravar_lbl}" 
                                           action="#{categoriaProdutoMB.salvar}" image="/imagens/save32x32.png"/>
                    </h:panelGrid>

                    <rich:extendedDataTable id="itensRegistoTable" noDataLabel="#{msg.sem_registo}" selectionMode="multiple"
                                            var="itensVar" value="#{categoriaProdutoMB.todosTable}" style="width: 500px; height: 300px" 
                                            selection="#{categoriaProdutoMB.selection}">

                        <a4j:ajax execute="itensRegistoTable idEdit nomeEdit" event="selectionchange" listener="#{categoriaProdutoMB.selectionListener}" render="idEdit nomeEdit" />

                        <rich:column>
                            <f:facet name="header">#{msg.campo_id}</f:facet>
                            #{itensVar.id}
                        </rich:column>
                        <rich:column width="398px">
                            <f:facet name="header">#{msg.campo_nome}</f:facet>
                            #{itensVar.nome}
                        </rich:column>
                    </rich:extendedDataTable>
                    <div align="center" style="width: 500px">
                        <a4j:commandButton value="#{msg.botao_eliminar_lbl}" onclick="#{rich:component('confirmPane')}.show();" execute="itensRegistoTable" 
                                           render="itensRegistoTable nome" image="/imagens/delete32x32.png" title="#{msg.botao_eliminar_lbl}"/>
                        <a4j:commandButton value="#{msg.botao_actualizar_lbl}" onclick="#{rich:component('editPane')}.show();" execute="itensRegistoTable nomeEdit" 
                                           render="itensRegistoTable nome" image="/imagens/edit32x32.png" title="#{msg.botao_actualizar_lbl}"/>
                    </div>
                    <!--PAINEL DE COMFIRMAÇÃO DE ELIMINAÇÃO DE REGISTO-->
                    <rich:popupPanel id="confirmPane" autosized="true" header="#{msg.header_eliminar_lbl}">
                        #{msg.delete_confirma}
                        <a4j:commandButton value="#{msg.botao_nao}" onclick="#{rich:component('confirmPane')}.hide(); return false;" />
                        <a4j:commandButton value="#{msg.botao_sim}" execute="itensRegistoTable" render="itensRegistoTable" action="#{categoriaProdutoMB.eliminar}" 
                                           oncomplete="#{rich:component('confirmPane')}.hide();"/>
                    </rich:popupPanel>
                    <!--FIM DO PAINEL DE COMFIRMAÇÃO DE ELIMINAÇÃO DE REGISTO-->
                </h:form>
                <!--PAINEL DE ACTUALIZAÇÃO DE REGISTO-->
                <rich:popupPanel id="editPane" autosized="true" header="#{msg.header_actualizar_lbl}">
                        <h:form prependId="false">
                            <h:panelGrid columns="10">
                                <h:outputLabel for="idEdit" value="#{msg.campo_id}"/>
                                <h:inputText id="idEdit" value="#{categoriaProdutoMB.modeloTemp.id}" readonly="true" size="3"/>
                                <h:outputLabel for="nomeEdit" value="#{msg.campo_funcao}"/>
                                <h:inputText id="nomeEdit" value="#{categoriaProdutoMB.modeloTemp.nome}" size="49"/>
                                <a4j:commandButton value="#{msg.botao_gravar_lbl}" execute="@form" render="idEdit nomeEdit itensRegistoTable" 
                                                   title="#{msg.botao_gravar_lbl}" action="#{categoriaProdutoMB.actulizar}" oncomplete="#{rich:component('editPane')}.hide();"/>
                                <a4j:commandButton value="#{msg.botao_cancelar}"  title="#{msg.botao_cancelar}" onclick="#{rich:component('editPane')}.hide(); return false;"/>
                            </h:panelGrid>
                        </h:form>
                    </rich:popupPanel>
                    <!--FIM DO PAINEL DE ACTUALIZAÇÃO DE REGISTO-->
                    <a4j:outputPanel id="res" style="width: 500px" ajaxRendered="true">
                        <rich:messages showDetail="true" id="msgs"/>
                </a4j:outputPanel>
            </rich:panel>
        </ui:define>
    </ui:composition>
</html>